﻿<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<c:set var="path" value="${pageContext.request.contextPath }" />
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport"
	content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
<!--[if lt IE 9]>
<script type="text/javascript" src="${path }/resource/plugin/hui/lib/html5.js"></script>
<script type="text/javascript" src="${path }/resource/plugin/hui/lib/respond.min.js"></script>
<script type="text/javascript" src="${path }/resource/plugin/hui/lib/PIE_IE678.js"></script>
<![endif]-->

<!-- 本框架基本脚本和样式 -->
<script type="text/javascript"
	src="${path }/resource/js/jquery-2.1.4.min.js"></script>
<script type="text/javascript"
	src="${path }/resource/js/systools/EXBase.js"></script>

<link rel="stylesheet"
	href="${path }/resource/plugin/kindeditor/themes/default/default.css" />
<link rel="stylesheet"
	href="${path }/resource/plugin/kindeditor/plugins/code/prettify.css" />
<script src="${path }/resource/plugin/kindeditor/kindeditor.js"></script>
<script src="${path }/resource/plugin/kindeditor/lang/zh_CN.js"></script>
<script
	src="${path }/resource/plugin/kindeditor/plugins/code/prettify.js"></script>


<!--[if IE 6]>
<script type="text/javascript" src="lib/DD_belatedPNG_0.0.8a-min.js" ></script>
<script>DD_belatedPNG.fix('*');</script>
<![endif]-->
</head>
<body>
	<div class="pd-20">
		<form class="form form-horizontal" method="post"
			action="admin/pruduct/addOrModify" id="dataform"
			onsubmit="javascripr:return false;">
			<c:if test="${obj ne null }">
				<input type="hidden" name="id" value="${obj.id }">
			</c:if>
			<div class="row cl">

				<label class="form-label col-1">名称</label>
				<div class="formControls col-3">
					<input type="text" dataType="*" class="input-text" name="name"
						value="${obj.name }">
				</div>
				<div class="col-2">
					<span class="Validform_checktip"></span>
				</div>


				<label class="form-label col-1">类型</label>
				<div class="formControls col-3">
					<select class="select select-box" size="1" name="cateId"
						id="cateId">
					</select>
				</div>
				<div class="col-2">
					<span class="Validform_checktip"></span>
				</div>


			</div>

			<div class="row cl">
				<label class="form-label col-1">价格</label>
				<div class="formControls col-3">
					<input type="text" dataType="n" class="input-text" name="source"
						value="${obj.source }">
				</div>
				<div class="col-2">
					<span class="Validform_checktip"></span>
				</div>

				<label class="form-label col-1">介绍</label>
				<div class="formControls col-3">
					<input type="text" dataType="*" class="input-text"
						name="description" value="${obj.description }">
				</div>
				<div class="col-2">
					<span class="Validform_checktip"></span>
				</div>
			</div>

			<div class="row cl">
				<label class="form-label col-1">是否立刻发布</label>
				<div class="formControls col-3">
					<c:if test="${obj ne null }">
						<label><input type="radio" name="isShow" value="1"
							<c:if test="${obj ne null && obj.isShow eq 1 }"> checked="checked" </c:if>>是</label>
						<label><input type="radio" name="isShow"
							<c:if test="${obj ne null && obj.isShow eq 2 }"> checked="checked" </c:if>
							value="2">否</label>
					</c:if>
					<c:if test="${obj eq null }">
						<label><input type="radio" name="isShow" value="1"
							checked="checked">是</label>
						<label><input type="radio" name="isShow" value="2">否</label>
					</c:if>
				</div>
				<div class="col-2">
					<span class="Validform_checktip"></span>
				</div>
			</div>

			<div class="row cl">
				<label class="form-label col-1">详细介绍</label>
				<div class="formControls col-9">
					<textarea name="content" id="artcontent">
						${obj.content}
						</textarea>
				</div>
				<div class="col-2">
					<span class="Validform_checktip"></span>
				</div>
			</div>

			<div class="row cl">
				<label class="form-label col-1">展示图片</label>
				<div class="formControls col-9">
					<span class="btn-upload form-group"> <input
						onclick="EXCommon.chooesFile()"
						class="input-text upload-url radius" type="text" id="showFileName"
						readonly> <a onclick="EXCommon.chooesFile()"
						class="btn btn-primary radius"><i class="fa fa-cloud-upload"></i>
							浏览文件</a>
					</span> <input type="button" class='btn btn-primary radius'
						onclick="EXCommon.upFile()" value="上传"> <a
						id="selectInServices" class="btn btn-primary radius"><i
						class="fa fa-cloud"></i> 远程图库</a>
				</div>
			</div>
			<div class="row cl">
				<div class="col-1"></div>
				<div class="col-md-offset-1 formControls col-9">
					<c:if test="${obj ne null }">
						<input type="hidden" value="${obj.showImg1}" name="showImg1"
							id="hiddenImg" />
						<img width="150" id='img_1' src="${obj.showImg1	 }" />
					</c:if>
					<c:if test="${obj eq null }">
						<input type="hidden" name="showImg1" id="hiddenImg" />
						<img width="150" id='img_1' style="display: none" />
					</c:if>
				</div>
			</div>

			<div class="row cl">
				<label class="form-label col-1">产品相册</label>
				<div class="formControls col-9">
					<div class="cl pd-5 bg-1 bk-gray">
						<span class="l"> <a class="btn btn-primary radius size-S"
							onclick="openAlbum()"><i class="fa fa-plus"></i> 上传照片</a> <a
							class="btn btn-primary radius size-S" id="albumOpenInservices"><i
								class="fa fa-cloud"></i> 从服务器选择</a> <a
							class="btn btn-danger radius size-S"
							onclick="EXGridTools.deltr('#J_imageView')"><i
								class="Hui-iconfont">&#xe6e2;</i>删除图片</a>
						</span>
					</div>
					<div>
						<table id="J_imageView"
							class="table table-border table-bordered table-bg table-hover table-sort hh">
							<thead>
								<tr class="text-c">
									<th width="40"><input name="" type="checkbox" value=""></th>
									<th width="40">序号</th>
									<th>URL</th>
									<th>排序</th>
									<th width="200">预览</th>
									<th width="40">操作</th>
								</tr>
							</thead>
							<tbody>
								<c:if test="${obj ne null }">
									<c:forEach var="item" items="${imgList }" varStatus="status">
										<tr class="text-c" id="rowId${status.index+1}">
											<td><input type="checkbox" value="1"></td>
											<td>${status.index+1}</td>
											<td>${item.path }</td>
											<td class="text-c"><input
												name="imgs[${status.index}].orderby" type="text"
												value="${item.orderby }" class="input-text size-S text-c"
												style="width: 40px;" /></td>
											<td><img width="100px" src="${item.path }"></td>
											<td class="f-16 text-c"><a
												onclick="EXUI.delRow('rowId${status.index+1}')"
												class="fa fa-trash-o f-16"></a></td>
											<input type="hidden" name="imgs[${status.index}].path"
												value="${item.path }" />
										</tr>
									</c:forEach>
								</c:if>
							</tbody>
						</table>
					</div>
				</div>
			</div>
			<div class="row cl ">
				<div class="col-10 col-offset-2">
					<a href="javascript:void(0)" onclick="EXForm.submit()"
						class="btn btn-success radius" id="save-btn">保存</a>
				</div>
			</div>
		</form>
		<form class="form form-horizontal" method="post"
			style="display: none;" enctype="multipart/form-data"
			target="blankFrame"
			action="${path }/resource/plugin/kindeditor/upload_json.jsp?dir=image&flag=img_1&hiddenImg=hiddenImg">
			<input id="fileText" type="file" multiple name="file-1"
				onchange="EXCommon.selectFile('#showFileName')" /> <input
				type="submit" id="submitBtn"
				onclick="EXCommon.upolad('img_1','file_1')" />
		</form>
		<iframe src="" name="blankFrame" id="blankFrame"
			style="height: 100px; width: 100px; display: none;"> </iframe>
	</div>
	<script type="text/javascript">
	<c:if test="${obj eq null }">
		var imgCount=0;
	</c:if>
	<c:if test="${obj ne null }">
		var imgCount=${imgLength};
	</c:if>
		var editor1 = null;
		$(function() {
			EXUI.createEdit("content", '100%', '400px', 'editor1');
			initFunctionList();
			//表单提交前同步编辑器数据
			EXForm.initForm({beforeSubnit:function(){
				editor1.sync();
			}});
			EXUI.openServiceImgSpace(function(url) {
				$("#img_1").attr("src", url).show();
				$("#hiddenImg").val(url);
			}, "#selectInServices");
			EXUI.openServiceImgSpace(function(url){
				var rows = $('#J_imageView');
				var html="";
				var count=rows.find("tr").length;
				var rowId=EXCommon.randomStr();
				var tr='<tr class="text-c" id="'+rowId+'">'
		           +'    <td><input  type="checkbox" value="1"></td>'
		           +'    <td>'+rows.find("tr").length+'</td>'
		           +'   <td>' + url + '</td>'
		           +'	<td class="text-c" ><input name="imgs['+imgCount+'].orderby" type="text" value="'+count+'" class="input-text size-S text-c" style="width:40px;"/></td>'
		           +'   <td><img  width="100px" src="' + url + '" ></td>'
		           +'   <td class="f-16 text-c"><a onclick="EXUI.delRow(\''+rowId+'\')" class="fa fa-trash-o f-16"></a></td>'
		           +'	<input type="hidden" name="imgs['+imgCount+'].path" value="'+url+'"  />'
		           +' </tr>';
				html+=(tr);
				imgCount++;
				rows.append(html);
			}, "#albumOpenInservices");
		});

		
		/**
		 * 初始化类型列表
		 */
		function initFunctionList() {
			$.AjaxProxy({
				a : false,
				c : false
			}).invoke("admin/pruductCate/all", function(loj) {
				$("#cateId").createSelectTree(loj.attr("result").dataList, {
					append : true,
					<c:if test="${obj ne null }">
					defaultValue:${obj.cateId}
					</c:if>
				});
			});
		}
		
		//点击添加相册按钮
		function openAlbum(){
			EXUI.openMultipleUpload(function(urlList){
				var rows = $('#J_imageView');
				var html="";
				var count=rows.find("tr").length;
				$(urlList).each(function(i,data){
					var rowId=EXCommon.randomStr();
					var tr='<tr class="text-c" id="'+rowId+'">'
			           +'    <td><input  type="checkbox" value="1"></td>'
			           +'    <td>'+(count+i)+'</td>'
			           +'   <td>' + data.url + '</td>'
			           +'	<td class="text-c" ><input name="imgs['+imgCount+'].orderby" type="text" value="'+count+'" class="input-text size-S text-c" style="width:40px;"/></td>'
			           +'   <td><img  width="100px" src="' + data.url + '" ></td>'
			           +'   <td class="f-16 text-c"><a onclick="EXUI.delRow(\''+rowId+'\')" class="fa fa-trash-o f-16"></a></td>'
			           +'	<input type="hidden" name="imgs['+imgCount+'].path" value="'+data.url+'"  />'
			           +' </tr>'
			           ;
					html+=(tr);
					imgCount++;
				});
				rows.append(html);
			});
		}
	</script>
</body>
</html>